<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page import="com.solution.common.config.PublicConfig"%>
<%@ page import="com.solution.wx.common.constants.PublicConstants"%>
<%
	String basePath = PublicConfig.ROOT_PATH;
	String wxRootUrl = PublicConfig.WX_ROOT_URL;
	String imgRootURL = PublicConfig.IMG_ROOT_URL; //阿里云图片显示域名
	String ossImgZoomWX = PublicConfig.OSS_IMG_ZOOM_WX; //微信图片缩放
%>
<!-- 引入jstl标签库 -->
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="sl" tagdir="/WEB-INF/tags" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<title>商品详情</title>
<link rel="stylesheet" type="text/css" href="<%=basePath%>/statics_wx/css/style.css?v=20180111">
<link rel="stylesheet" type="text/css" href="<%=basePath%>/statics_wx/css/main2.css">
<link rel="stylesheet" type="text/css" href="<%=basePath%>/statics_wx/css/swiper.min.css">
<script type="text/javascript">
//系统域名 
var rootPath = '<%=basePath %>';
var wxRootUrl = '<%=wxRootUrl%>';
// 系统上传文件展示域名
var imgRootURL = '<%=imgRootURL %>';
// 微信图片缩放
var ossImgZoomWX = '<%=ossImgZoomWX %>';
</script>
<script src="<%=basePath%>/statics_wx/js/jquery.min.js"></script>
<script src="<%=basePath%>/statics_wx/js/js.js"></script>
<script src="<%=basePath%>/statics_wx/js/swiper.min.js"></script>
<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript" src="<%=basePath%>/statics/plugins/layer/layer.js"></script>
<script type="text/javascript" src="<%=basePath%>/statics_wx/js/custom.js"></script>
<style type="text/css">
	table {
		margin-top:10px;
	    margin-bottom: 10px;
	    border-collapse: collapse;
	    display: table;
	}
	td, th {
	    padding: 5px 2px;
	    border: 1px solid #DDD;
	}
	.prd_intro1 img {
		max-width: 100%;
	}

	.box4_2 div img.current{
		border: 1px solid #e52244;
	}
	.pagination{top:auto;bottom:0.1rem;}
	.overlay {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.5);
		z-index: 100;
	}
	.share_box img {
		width: 100%;
	}
</style>

</head>
<body style="background: #f3f3f3">
	<c:set var="rootPath" value="<%=basePath %>"></c:set>
	<c:set var="imgRootURL" value="<%=imgRootURL %>"></c:set>
	<c:set var="ossImgZoomWX" value="<%=ossImgZoomWX %>"></c:set>
	<input type="hidden" id="appId" value="${appId }"/>
	<input type="hidden" id="timestamp" value="${timestamp }"/>
	<input type="hidden" id="nonceStr" value="${nonceStr }"/>
	<input type="hidden" id="signature" value="${signature }"/>
	<input type="hidden" id="main_produt_price"  value="${mainProductPrice }"/>
	<input type="hidden" id="shareTitle" value="${shareInfo.shareTitle}"/>
	<input type="hidden" id="shareDesc" value="${shareInfo.shareDesc}"/>
	<input type="hidden" id="shareInfoId" value="${shareInfo.id}"/>
	<input type="hidden" id="productId" value="${shareInfo.sharedProductId}"/>
	<input type="hidden" id="shareImage" value="${imgRootURL }${shareInfo.sharedProductImagePath }${ossImgZoomWX }"/>
	<input type="hidden" id="uuid" value="${uuid}"/>
	<input type="hidden" id="shareLinkUrl" value=""/>
	<%--是否拥有规格项 --%>
	<input type="hidden" id="has_spec" value="${hasSpec}"/>
	<input type="hidden" id="product_id" value="${productDetailMap['product_info'].id}"/>
	<input type="hidden" id="product_title" value="${productDetailMap['product_info'].productTitle}"/>

	<div class="add_comment1" id="add_comment" style="display:none">
		<div class="add_comment1_con">
			<p>
				<strong><input id="shareCommentContent" type="text" class="inputstyle1" placeholder="添加评论" /></strong>
				<a href="javascript:void(0);" onclick="publishShareComment(this);">发送</a>
			</p>
		</div>
	</div>
	<div class="add_comment1" id="reply_comment" style="display:none">
		<div class="add_comment1_con">
			<p>
				<strong>
					<input id="parentCommentId" type="hidden" value=""/>
					<input id="parentCommentName" type="hidden" value=""/>
					<input id="replyCommentContent" type="text" class="inputstyle1" placeholder="" />
				</strong>
				<a href="javascript:void(0);" onclick="publishReplyComment(this);">发送</a>
			</p>
		</div>
	</div>
	<div class="overlay" id="share_box" style="display: none">
		<div class="share_box">
			<img src="<%=basePath%>/statics_wx/images/share_pic.png" />
		</div>
	</div>
	<div class="overlay" id="goods_editbox" style="display: none">
		<div class="goods_editbox">
			<a href="javascript:void(0);" class="icon_close"></a>
			<div class="goods_editbox_con">
				<div class="good_info1">
					<div class="pic">
						<img src="${imgRootURL}${productDetailMap['product_info'].productImgPath}" />
					</div>
					<div class="item-info">
						<h2>${productDetailMap['product_info'].productName}</h2>
						<h3 id="spec_selector_product_price">
							￥<em><sl:nformat num="${productPrice}" format=".00" type="2"/></em>
								  <sl:nformat num="${productPrice}" format=".00" type="3"/>
						</h3>
					</div>
				</div>
				 <c:if test="${isLogin == '0'}">
			        <div id="please_login_tip">
			        	<a href="javascript:void(0);" id="btn_please_login"><p style="color:#d30000;font-size:13px;">登录可享更多优惠，请登录！</p></a>
			        </div>
		        </c:if>
				<div class="good_info2">
					<c:forEach items="${productDetailMap['product_spec']}" var="productSpec">
						<div name="spec_list" class="hd">
							<h3>${productSpec.specName }</h3>
						</div>
						<div class="bd">
							<div class="good_sxlist">
								<ul>
									<c:forEach items="${productSpec.productSpecList}" var="spec" varStatus="ind">
										<li spec_price="${spec.specPrice}">
											<label ${ind.index == 0 ? "class='checked'" : "" } spec_id="${spec.id}">${spec.specValue}</label>
										</li>
									</c:forEach>
								</ul>
							</div>
						</div>
					</c:forEach>
				</div>
				<div class="good_info3">
					<strong>数量</strong>
					<div class="txt1">
						<b>
							<a href="javascript:void(0);" class="icon_jian_gray" id="subtract_num" onclick="editShopcartNum(this);"></a>
							<span>
								<input id="buy_num" type="text" value="1">
							</span>
							<a href="javascript:void(0);" class="icon_jia"id="add_num" onclick="editShopcartNum(this);"></a>
						</b>
					</div>
				</div>
			</div>
			<div class="bottom">
				<p>
					<input type="button" id="btn_add_shoppingcart" class="inputbtn1" value="确定" />
				</p>
			</div>
		</div>
	</div>

	<div class="detail_pic">
		<div class="detail_header">
			<a href="#" class="icon_back"></a>
		</div>
		<div class="swiper-container">
			<div class="swiper-wrapper">
				<c:forEach items="${productDetailMap['product_image']}" var="image">
					<div class="swiper-slide">
						<img src="${imgRootURL}${image.imagePath}" />
					</div>
				</c:forEach>
			</div>
			<!-- <div class="qbdd_nav">
				<a href="#">全部订单</a>
			</div> -->
			<!-- Add Pagination -->
			<div class="swiper-pagination"></div>
			<!-- Add Arrows -->
		</div>
	</div>
	<div class="mydetail_info1">
		<div class="mydetail_info1_con">
			<div class="priceinfo">
				<h1>
					￥<strong><sl:nformat num="${productPrice}" format=".00" type="2"/></strong>
					<sl:nformat num="${productPrice}" format=".00" type="3"/>
				</h1>
			</div>
			<div class="detail_infos1">
				<h1>${shareInfo.shareTitle }</h1>
			</div>
			<div class="detail_infos2">
				<div class="left">
					<p>
						<%--
						<c:choose>
							<c:when test="${fn:contains(shareInfo.wxHeadImage, 'http')}">
								<i><img src="${shareInfo.wxHeadImage }" /></i>
							</c:when>
							<c:otherwise>
								<i><img src="${imgRootURL }${shareInfo.wxHeadImage }${ossImgZoomWX }" /></i>
							</c:otherwise>
						</c:choose>
						<span>${shareInfo.userName }</span>
						--%>
					</p>
				</div>
				<div class="right">
					<p>分享时间：<fmt:formatDate value="${shareInfo.shareTime }" pattern="yyyy-MM-dd HH:mm:ss" /></p>
				</div>
			</div>
		</div>
	</div>
	
	
	
	
	<div class="prd_nav">
		<ul>
			<li tag="productIntro" class="current"><a
				href="javascript:void(0)">商品介绍<i></i></a></li>
			<li tag="productProperty"><a href="javascript:void(0)">属性参数<i></i></a></li>
			<li tag="evaluation"><a href="javascript:void(0)">评价（${evaluationPage.totalCount }）<i></i></a></li>
		</ul>
	</div>
	<div class="prd_intro">
		<div class="prd_intro_con">
			<div class="myintro">
				<div class="prd_intro1" style="margin-bottom:30px;">${productDetailMap['product_info'].productIntro }</div>
			</div>
			<div class="myintro">
				<div class="prd_intro1">
					<div class="prd_intro11">
						<table>
							<table>
								<c:forEach items="${productDetailMap['productPropertyList'] }" var="property">
									<tr>
										<td>${property.propertyName}</td>
										<td>${property.propertyValue }</td>
									</tr>
								</c:forEach>
							</table>
						</table>
					</div>
				</div>
			</div>
			<div class="myintro comment_list">
				<div class="prd_intro2">
					<input id="numPerPage" type="hidden" value="${evaluationPage.numPerPage }" /> 
					<input id="currentPage" type="hidden" value="${evaluationPage.currentPage }" /> 
					<input id="pageCount" type="hidden" value="${evaluationPage.pageCount }" />
					<ul id="comment_ul">
						<c:forEach items="${evaluationPage.recordList }" var="record" varStatus="i">
							<li>
								<div class="box4">
									<div class="pic">
										<img src="${imgRootURL}/${record.headImage }?x-oss-process=image/resize,h_100/format,png" onerror="this.src='${rootPath }/statics_wx/images/user_img2.png'"/>
									</div>
									<div class="item-info">
										<div class="box4_1">
											<div class="left">
												<h2 class="username">${record.userName }</h2>
												<h3>
													<span class="bg1">
														<span class="bg2" style="width: ${record.score * 20 }%"></span>
													</span>
												</h3>
											</div>
											<div class="right">
												<p>${record.createTimeStr }</p>
											</div>
										</div>
										<div class="box4_2">
											<p>${record.content }</p>
										</div>
										<c:if test="${fn:length(record.filePathList) > 0}">
										<div class="box4_2">
											<p>
												<c:forEach items="${record.filePathList }" var="filePath" varStatus="i2">
												<div style="float:left; margin-left: 5px;">
													<img class="smallpics" data-src="${imgRootURL}/${filePath}" src="${imgRootURL}/${filePath}?x-oss-process=image/resize,m_pad,h_50,w_50,color_000000/format,png" alt="" onclick="imageView(this);"/>
												</div>
												</c:forEach>
											</p>
										</div>
										</c:if>
										<div class="box4_3">
											<dl>
												<dt>${record.productName }</dt>
												<%-- <dt>购买日期：${record.createTimeStr }</dt> --%>
											</dl>
										</div>
									</div>
								</div>
							</li>
						</c:forEach>
					</ul>
				</div>
			</div>
		</div>
	</div>
	
	
	<%--
	
	<div class="mydetail_info2">
		<div class="hd">
			<h3>
				<i></i><span>商品详情</span>
			</h3>
		</div>
		<div class="bd">
			<div class="pl_list">
			<style>
			.prd_intro1 img{width:100%}
			</style>
				<div class="prd_intro1">${productDetailMap['product_info'].productIntro }</div>
			</div>
		</div>
	</div>
	
	<div class="mydetail_info2">
		<div class="hd">
			<h3>
				<i></i><span>评论</span>
			</h3>
			<a href="javascript:void(0);" onclick="window.location.href='${rootPath}/wx/share/wxShareCommentPage?shareId=${shareInfo.id }'">
				<b><span>共${shareInfo.commentQuantity }条评论</span><i></i></b>
			</a>
		</div>
		<div class="bd">
			<div class="pl_list">
				<ul>
					<c:forEach items="${shareCommentPage.recordList }" var="comment" varStatus="status">
						<li>
							<div class="boxs1">
								<div class="pic">
									<c:choose>
										<c:when test="${fn:contains(comment.commentUserHeadImage, 'http')}">
											<img src="${comment.commentUserHeadImage }" />
										</c:when>
										<c:otherwise>
											<img src="${imgRootURL }${comment.commentUserHeadImage }${ossImgZoomWX }" />
										</c:otherwise>
									</c:choose>
								</div>
								<div class="item-info">
									<div class="boxs_1_1">
										<h2>${comment.commentNickname }</h2>
										<p>${comment.commentContent }</p>
									</div>
									<div class="boxs_1_2">
										<div class="left">
											<p><fmt:formatDate value="${comment.commentTime }" pattern="yyyy-MM-dd HH:mm:ss" /></p>
										</div>
										<div class="right">
											<dl>
												<dt name="doCommentDt">
													<a href="javascript:void(0);" onclick="doCommentUserComment(${comment.id},'${comment.commentNickname }')">回复</a>
												</dt>
												<dt>
													<c:if test="${comment.isUserLike eq 0 }">
														<a href="javascript:void(0);" onclick="doShareCommentLike(this, ${comment.id})">
															<i></i>
															<span name="commentLikeQuantity">${comment.commentLikeQuantity }</span>
														</a>
													</c:if>
													<c:if test="${comment.isUserLike eq 1 }">
														<a href="javascript:void(0);" class="current">
															<i></i>
															<span name="commentLikeQuantity">${comment.commentLikeQuantity }</span>
														</a>
													</c:if>
												</dt>
											</dl>
										</div>
									</div>
									<c:if test="${comment.commentReply > 0 }">
										<div class="boxs_1_3">
											<div class="boxs_1_3_con">
												<c:forEach items="${comment.replyList }" var="replyComment" varStatus="replyStatus">
													<c:if test="${replyStatus.index eq 0 }">
														<div name="replyDiv">
															<p>${replyComment.commentNickname }：${replyComment.commentContent }</p>
														</div>
													</c:if>
												</c:forEach>
												<c:if test="${comment.commentReply > 1 }">
													<strong>
														<a href="javascript:void(0);" onclick="queryAllReply(this,${comment.id})">共${comment.commentReply }条回复&nbsp;&gt;</a>
													</strong>
													<strong style="display: none;">
														<a href="javascript:void(0);" onclick="showAllReply(this)">共${comment.commentReply }条回复&nbsp;&gt;</a>
													</strong>
													<strong style="display: none;">
														<a href="javascript:void(0);" onclick="hideAllReply(this)">收起所有回复&nbsp;&gt;</a>
													</strong>
												</c:if>
											</div>
										</div>
									</c:if>
								</div>
							</div>
						</li>
					</c:forEach>
				</ul>
			</div>
		</div>
		<div class="view_all">
			<a href="javascript:void(0);" onclick="window.location.href='${rootPath}/wx/share/wxShareCommentPage?shareId=${shareInfo.id }'">
				查看全部<span>${shareInfo.commentQuantity }</span>条评论
			</a>
		</div>
	</div>
	--%>
	
	
	<!-- 
	<div class="relatecp">
		<div class="hd">
			<h3>
				<i></i><span>相关潮品</span>
			</h3>
		</div>
		<div class="bd">

			<ul class="wall">
				<li class="article">
					<div class="box1">
						<div class="pic">
							<img src="images/pic1.png" />
						</div>
						<div class="item-info">
							<h2>联想(Lenovo)拯救者R720 15.6英寸游戏笔记...</h2>
							<dl>
								<dt>
									<i><img src="images/user_img1.png" /></i><span>梦想上天</span>
								</dt>
								<dt>
									<em></em><span>145820</span>
								</dt>
							</dl>
						</div>
					</div>
				</li>
				<li class="article">
					<div class="box1">
						<div class="pic">
							<img src="images/pic2.png" />
						</div>
						<div class="item-info">
							<h2>联想(Lenovo)拯救者R720 15.6英寸游戏笔记...</h2>
							<dl>
								<dt>
									<i><img src="images/user_img1.png" /></i><span>梦想上天</span>
								</dt>
								<dt>
									<em></em><span>820</span>
								</dt>
							</dl>
						</div>
					</div>
				</li>
				<li class="article">
					<div class="box1">
						<div class="pic">
							<img src="images/pic3.png" />
						</div>
						<div class="item-info">
							<h2>联想(Lenovo)拯救者R720 15.6英寸游戏笔记...</h2>
							<dl>
								<dt>
									<i><img src="images/user_img1.png" /></i><span>梦想上天</span>
								</dt>
								<dt>
									<em></em><span>145820</span>
								</dt>
							</dl>
						</div>
					</div>
				</li>
				<li class="article">
					<div class="box1">
						<div class="pic">
							<img src="images/pic4.png" />
						</div>
						<div class="item-info">
							<h2>联想(Lenovo)拯救者R720 15.6英寸游戏笔记...</h2>
							<dl>
								<dt>
									<i><img src="images/user_img1.png" /></i><span>梦想上天</span>
								</dt>
								<dt>
									<em></em><span>145820</span>
								</dt>
							</dl>
						</div>
					</div>
				</li>
			</ul>
		</div>
	</div>
	-->
	<div class="footerfixed"></div>
	<div class="myfooter">
		<ul>
			<li ${shareInfo.isUserLike == '1' ? 'class="current"' : ''}>
				<c:if test="${shareInfo.isUserLike eq '1' }">
					<a href="javascript:void(0);">
						<p>
							<i class="icon1"></i><span>赞<em id="likeNum">${shareInfo.likeQuantity }</em></span>
						</p>
					</a>
				</c:if>
				<c:if test="${shareInfo.isUserLike ne '1' }">
					<a href="javascript:void(0);" onclick="doShareInfoLike(this);">
						<p>
							<i class="icon1"></i><span>赞<em id="likeNum">${shareInfo.likeQuantity }</em></span>
						</p>
					</a>
				</c:if>
			</li>
			<li id="doCommentLi">
				<a href="javascript:void(0);">
					<p>
						<i class="icon2"></i><span>评论<em>${evaluationPage.totalCount }</em></span>
					</p>
				</a>
			</li>
			<li ${shareInfo.isUserFavorite == '1' ? 'class="current"' : ''}>
				<c:if test="${shareInfo.isUserFavorite eq '1' }">
					<a href="javascript:void(0);" onclick="removeShareInfoFavorite(this);">
						<p>
							<i class="icon3"></i><span>收藏<em id="favoriteNum">${shareInfo.favoriteQuantity }</em></span>
						</p>
					</a>
				</c:if>
				<c:if test="${shareInfo.isUserFavorite ne '1' }">
					<a href="javascript:void(0);" onclick="doShareInfoFavorite(this);">
						<p>
							<i class="icon3"></i><span>收藏<em id="favoriteNum">${shareInfo.favoriteQuantity }</em></span>
						</p>
					</a>
				</c:if>
			</li>
			<li>
				<a href="javascript:void(0)" class="sharebtn">
					<p>
						<i class="icon4"></i><span>分享<em id="shareNum">${shareInfo.shareQuantity }</em></span>
					</p>
				</a>
			</li>
			<li style="background:#d30000;">
				<a href="javascript:void(0)" class="buybtn">
					<p>
						<i class="icon5"></i><span>立即购买</span>
					</p>
				</a>
			</li>
		</ul>
	</div>
	<style type="text/css">
		.layui-layer-btn a{
			font-size:13px;
		}
	</style>
	<script src="<%=basePath%>/statics_wx/js/jaliswall.js" type="text/javascript" charset="utf-8"></script>
	<script src="<%=basePath%>/js/wx/share/share_detail.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>